<!DOCTYPE html>
<html lang="en">

<head>
    <title>作品集</title>
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="css/templatemo-style.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/media.css">
    <link rel="stylesheet" href="./css/index-less.css">

</head>

<body>
    <!-- 头部导航开始 -->
    <header class="site-header" id="top">
        <nav class="navbar navbar-default navbar-fixed-top">
            <div class="container">
                <div class="row">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" id="open" data-toggle="collapse" data-target="">
                          <span class="glyphicon glyphicon-list"></span>
                        </button>
                        <div class="logo-wrapper">
                            <div class="navbar-brand">
                                <p>作品集(制作中)</p>
                            </div>
                        </div>
                    </div>
                    <div class="collapse navbar-collapse" id="main-menu">
                        <ul class="nav navbar-nav navbar-right">
                            <li><span></span><a href="javascript:;" class="home">个人信息</a></li>
                            <!-- <li><span></span><a href="javascript:;" class="about">技能介绍</a></li> -->
                            <li><span></span><a href="javascript:;" class="portfolio">项目展示</a></li>
                            <li><span></span><a href="javascript:;" class="map">作品与案例</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </nav>
    </header>
    <!-- 头部导航结束 -->
    <!-- 个人信息开始 -->
    <div id="big-banner" class="y_Weiz">

        <div class="y_biaoti_nr container">
            <div class="row y_biaoti_row visible-sm visible-md visible-lg">
                <div class="col-md-12 col-sm-12">
                    <div>
                        <div class="thumbnail">
                            <img src="./picture/br.jpg" alt="..." width="10%">
                        </div>
                        <h1>叶 林 建</h1>
                        <h5>Ye-lin-jian</h5>
                        <ul class="row">
                            <li><span class="glyphicon glyphicon-user"></span><strong>年龄:</strong><i>24</i></li>
                            <li><span class="glyphicon glyphicon-map-marker"></span><strong>籍贯:</strong><i>广东-湛江</i></li>
                            <li><span class="glyphicon glyphicon-earphone"></span><strong>电话:</strong><i>13078274227</i></li>
                            <li><span class="glyphicon glyphicon-envelope"></span><strong>邮箱:</strong><i>1512156049@qq.com</i></li>
                        </ul>
                    </div>
                </div>

            </div>
            <div id="carousel-example-generic" class="carousel slide visible-xs" data-ride="carousel" data-interval="false">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                    <div class="item active">
                        <div class="row y_biaoti_row">
                            <div class="col-md-3 col-sm-5">
                                <div>
                                    <div class="thumbnail">
                                        <img src="./picture/br.jpg" alt="..." width="50%">
                                    </div>
                                    <h1>叶 林 建</h1>
                                    <h3>Ye-lin-jian</h3>
                                    <ul class="row">
                                        <li><span class="glyphicon glyphicon-user"></span><strong>年龄:</strong><i>24</i></li>
                                        <li><span class="glyphicon glyphicon-map-marker"></span><strong>籍贯:</strong><i>广东-湛江</i></li>
                                        <li><span class="glyphicon glyphicon-earphone"></span><strong>电话:</strong><i>13078274227</i></li>
                                        <li><span class="glyphicon glyphicon-envelope"></span><strong>邮箱:</strong><i>1512156049@qq.com</i></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 个人信息结束 -->
    <!-- 技能介绍开始 -->
    <!-- <div id="first-section" class="y_Weiz">
        <div class="heading">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <h2 class="header-section-title">我的技能</h2>
                        <p>My skills</p>

                    </div>
                </div>
            </div>
        </div>
    </div> -->
    <!-- <div id="first-section1">
        <div class="container">
            <div class="row">
                <div class="triangle"></div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <section id="cd-timeline" class="cd-container y_container">
                        <div class="cd-timeline-block">
                            <div class="cd-timeline-img cd-picture">
                                <img src="picture/first-icon.png" alt="Picture">
                            </div>
                            <div class="cd-timeline-content service-box-content">
                                <h2>基础</h2>
                                <p>1.</p>
                                <p>2.</p>
                                <p>3.</p>
                            </div>
                        </div>
                        <div class="cd-timeline-block">
                            <div class="cd-timeline-img cd-movie">
                                <img src="picture/second-icon.png" alt="Picture">
                            </div>
                            <div class="cd-timeline-content service-box-content">
                                <h2>框架</h2>
                                <p>1.</p>
                                <p>2.</p>
                                <p>3.</p>
                            </div>
                        </div>
                        <div class="cd-timeline-block">
                            <div class="cd-timeline-img cd-icon">
                                <img src="picture/third-icon.png" alt="Picture">
                            </div>
                            <div class="cd-timeline-content service-box-content">
                                <h2>工具</h2>
                                <p>1.</p>
                                <p>2.</p>
                                <p>3.</p>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div> -->
    <!-- 技能介绍结束 -->
    <!-- 项目展示开始 -->
    <div id="cta" class="y_Weiz">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h4>项目展示</h4>
                    <p>Project presentation</p>
                </div>
            </div>
        </div>
    </div>
    <div id="second-section2" class="y_Xiangm">
        <div class="container">
            <!-- <div class="row">
                <div class="triangle"></div>
            </div> -->
            <div class="row">
                <div class="col-md-12">
                    <section id="cd-timeline-2" class="cd-container">
                        <div class="cd-timeline-block">
                            <a href="javascript:;">
                                <div class="cd-timeline-img cd-picture">
                                    <img src="picture/camera-icon.png" alt="Picture">
                                </div>
                                <a href="http://yelinjian.gitee.io/xiaoye/Works/Epidemicsurveillance/">
                                    <div class="cd-timeline-content projects">
                                        <img src="./images/xiangmu01.png" alt="">
                                        <div class="project-content">
                                            <h2>项目名:国内&全球疫情数据监控(响应式)</h2>
                                            <span>开发时间:2020-7-25~至今</span>
                                        </div>
                                    </div>
                                </a>
                            </a>
                        </div>
                        <div class="cd-timeline-block">
                            <a href="http://yelinjian.gitee.io/xiaoye/Works/Dist/">
                                <div class="cd-timeline-img cd-picture">
                                    <img src="picture/camera-icon.png" alt="Picture">
                                </div>
                                <div class="cd-timeline-content projects">
                                    <img src="./images/xiangmu02.png" alt="">
                                    <div class="project-content">
                                        <h2>深夜咖啡外送平台(手机端)</h2>
                                        <span>2020-8-10~至今</span>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <!-- <div class="cd-timeline-block">
                            <a href="javascript:;">
                                <div class="cd-timeline-img cd-picture">
                                    <img src="picture/camera-icon.png" alt="Picture">
                                </div>
                                <div class="cd-timeline-content projects">
                                    <img src="picture/project-3.jpg" alt="">
                                    <div class="project-content">
                                        <h2>正在装修(客官别急)</h2>
                                        <span>2020-7-11~至今</span>
                                    </div>
                                </div>
                            </a>
                        </div> -->
                    </section>
                </div>
            </div>
        </div>
    </div>
    <!-- 项目展示结束 -->

    <!-- 作品与案例开始 -->
    <div id="map" class="y_Weiz y_Zuopanli">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h4>作品与案例</h4>
                    <p>Works and cases</p>
                </div>
            </div>

            <div class="row y_row_nr">
                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Conpodoc" class="thumbnail" target="_black">
                        <img src="./images/fmian-02.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>Conpodoc首页(响应式)</strong>
                          <strong>技术点</strong>
                          <strong>html/css/javascript</strong>
                          <strong>bootstrap/jQurey</strong>
                        </span>
                    </a>
                </div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Bailu" class="thumbnail" target="_black">
                        <img src="./images/fmian-01.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>白鹭引擎首页(响应式)</strong>
                          <strong>技术点</strong>
                          <strong>html/css/javascript</strong>
                          <strong>bootstrap/jQurey</strong>
                        </span>
                    </a>
                </div>
                <div class="clearfix visible-xs-block  visible-sm-block"></div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Models" class="thumbnail" target="_black">
                        <img src="./images/fmian-03.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>Models首页(响应式)</strong>
                          <strong>技术点</strong>
                          <strong>html/css/javascript</strong>
                          <strong>bootstrap/jQurey</strong>
                        </span>
                    </a>
                </div>
                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Box_3D" class="thumbnail" target="_black">
                        <img src="./images/fmian-04.png" alt="...">
                        <span>
                        <strong>作品名</strong>
                        <strong>3D划入打开盒子(响应式)</strong>
                        <strong>技术点</strong>
                        <strong>html/css3</strong>
                      </span>
                    </a>
                </div>
                <div class="clearfix visible-xs-block  visible-sm-block"></div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/JDhomepage" class="thumbnail" target="_black">
                        <img src="./images/fmian-05.png" alt="...">
                        <span>
                        <strong>作品名</strong>
                        <strong>京东首页(PC端)</strong>
                        <strong>技术点</strong>
                        <strong>html/css3/javaScript</strong>
                      </span>
                    </a>
                </div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Luckydraw" class="thumbnail" target="_black">
                        <img src="./images/fmian-06.png" alt="...">
                        <span>
                        <strong>作品名</strong>
                        <strong>幸运抽奖</strong>
                        <strong>技术点</strong>
                        <strong>html/css3/javaScript</strong>
                      </span>
                    </a>
                </div>
            </div>

            <div class="row y_row_nr">
                <div class="col-xs-6 col-md-4 ">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Drawinboard" class="thumbnail" target="_black">
                        <img src="./images/fmian-10.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>Canvas画板</strong>
                          <strong>技术点</strong>
                          <strong>javascript/Canvas</strong>
                        </span>
                    </a>
                </div>
                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Loadanimation" class="thumbnail" target="_black">
                        <img src="./images/fmian-12.png" alt="...">
                        <span>
                        <strong>作品名</strong>
                        <strong>Loading加载动画</strong>
                        <strong>技术点</strong>
                        <strong>css3动画</strong>
                      </span>
                    </a>
                </div>
                <div class="col-xs-6 col-md-4  hidden-xs">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Ghostbutton" class="thumbnail" target="_black">
                        <img src="./images/fmian-11.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>幽灵按钮</strong>
                          <strong>技术点</strong>
                          <strong>css3动画</strong>
                        </span>
                    </a>
                </div>
                <div class="clearfix visible-xs-block  visible-sm-block"></div>


            </div>

            <!-- ------------------------------------------------------------------------------ -->
            <div class="row y_row_nr">
                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Jigsawpuzzle" class="thumbnail" target="_black">
                        <img src="./images/fmian-07.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>拖拽拼图</strong>
                          <strong>技术点</strong>
                          <strong>javascript/HTML5</strong>
                        </span>
                    </a>
                </div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Linkage" class="thumbnail" target="_black">
                        <img src="./images/fmian-08.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>省市区三级联动</strong>
                          <strong>技术点</strong>
                          <strong>javascript</strong>
                        </span>
                    </a>
                </div>
                <div class="clearfix visible-xs-block  visible-sm-block"></div>

                <div class="col-xs-6 col-md-4">
                    <a href="http://yelinjian.gitee.io/xiaoye/Works/Pictureupload" class="thumbnail" target="_black">
                        <img src="./images/fmian-09.png" alt="...">
                        <span>
                          <strong>作品名</strong>
                          <strong>图片上传</strong>
                          <strong>技术点</strong>
                          <strong>javascript</strong>
                        </span>
                    </a>
                </div>
            </div>
            <!-- -------------------------------------------------------------------------------- -->

        </div>
    </div>
    <!-- 作品与案例结束 -->

    <!-- 尾部开始 -->
    <div id="third-section">
        <div class="heading">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <h2>非常感谢您阅读我的简历</h2>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer>
        <div class="container">
            <div class="footer-content">
                <div class="row">
                    <div class="col-md-12">
                        <div class="back-to">
                            <div class="back-to-top">
                                <a href="javascript:;">回到顶部</a>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- 尾部结束 -->
    <script src="https://cdn.staticfile.org/jquery/3.5.1/jquery.min.js"></script>
    <script src="js/modernizr.min.js"></script>
    <script data-cfasync="false" src="js/email-decode.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/custom.js"></script>
</body>

</html>